import { defineComponent, onMounted, reactive } from 'vue'
import Draw from './draw'
import { getCategoryVisuals } from '@/api/datavisual'

export default defineComponent({
  components: {
    Draw,
  },
  setup(props,context) {
    const cdata = reactive({
      xData: [],
      seriesData: [],
    })
    context.expose({
      setCategoryPieData: (data: any)=>{
        setData(data)
      }
    })
    const setData = (content: any) => {
      cdata.xData = []
      cdata.seriesData = []
      content.forEach((v)=>{
        cdata.xData.push(v.categoryName);
        cdata.seriesData.push({name: v.categoryName, value: v.num});
      })
    }

    onMounted(() => {
      getCategoryVisuals().then((res)=>{
        if(res.code === '00000'){
          const data = res.data
          setData(data)
        }
      })
    })
    return () => {
      return (
        <div>
          <Draw cdata={cdata} />
        </div>
      )
    }
  },
})
